<template>
  <div class="issue">
    <van-contact-card type="add" @click="onAdd" add-text="新增商户" />
    <van-list v-model="loading" :finished="finished" finished-text="暂无更多商户信息" @load="onLoad">
      <van-cell
        v-for="item in list"
        :title="item.name"
        :value="item.deputy"
        is-link
        @click="onDetail(item.id)"
        :key="item.id"
      />
    </van-list>
  </div>
</template>
<script>
import { getConsultingList } from '@/api/commercialTenant.js'
import { Toast } from 'vant'

export default {
  name: 'issue',
  data() {
    return {
      list: [],
      loading: false,
      finished: false,
      pageNum: 1,
      pageSize: 8,
      total: ''
    }
  },
  computed: {
    query() {
      return {
        pageNum: this.pageNum,
        pageSize: this.pageSize
      }
    }
  },
  methods: {
    // 跳转新增商户页
    onAdd() {
      this.$router.push('/commercialTenant/add')
    },
    onDetail(id) {
      this.$router.push(`/commercialTenant/detail/${id}`)
    },
    onClickLeft: function () {
      this.$router.go(-1)
    },
    onLoad() {
      // 异步更新数据
      setTimeout(() => {
        getConsultingList({
          pageNum: this.pageNum,
          pageSize: this.pageSize
        }).then(res => {
          // 下拉刷新获取
          const { rows, total } = res
          this.total = total
          this.list = [...this.list, ...rows]
          this.pageNum = this.pageNum + 1
          this.loading = false

          if (this.list.length >= this.total) {
            this.finished = true
          }
        })
      }, 500)
    },
    toDetail: function (reportId) {
      this.$router.push({
        path: '/issueReport',
        query: { reportId: reportId }
      })
    }
  }
}
</script>